<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Arkham</title>
        <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
        <link href="/Arkham/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="/Arkham/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
        <!-- Ionicons -->
        <link href="/Arkham/css/ionicons.min.css" rel="stylesheet" type="text/css" />
        <!-- Morris chart -->
        <link href="/Arkham/css/morris/morris.css" rel="stylesheet" type="text/css" />
        <!-- jvectormap -->
        <link href="/Arkham/css/jvectormap/jquery-jvectormap-1.2.2.css" rel="stylesheet" type="text/css" />
        <!-- Date Picker -->
        <link href="/Arkham/css/datepicker/datepicker3.css" rel="stylesheet" type="text/css" />
        <!-- Daterange picker -->
        <link href="/Arkham/css/daterangepicker/daterangepicker-bs3.css" rel="stylesheet" type="text/css" />
        <!-- bootstrap wysihtml5 - text editor -->
        <link href="/Arkham/css/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css" rel="stylesheet" type="text/css" />
        <!-- Theme style -->
        <link href="/Arkham/css/AdminLTE.css" rel="stylesheet" type="text/css" />
        


        <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
          <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
        <![endif]-->
    </head>
    <body class="skin-blue">
        <!-- header logo: style can be found in header.less -->
        <header class="header">
            <span class="logo">
                <!-- Add the class icon to your logo image or logo icon to add the margining -->
                Arkham
            </span>
            <!-- Header Navbar: style can be found in header.less -->
            <nav class="navbar navbar-static-top" role="navigation">
                <!-- Sidebar toggle button-->
                <a href="#" class="navbar-btn sidebar-toggle" data-toggle="offcanvas" role="button">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </a>
                <div class="navbar-right">
                    <ul class="nav navbar-nav">
                        <!--<?php debug($statusMangas);?>-->
                        <li class="dropdown tasks-menu">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <i class="fa fa-book"></i>
                                <span class="label label-success"><?=(sizeof($statusMangas))?></span>
                            </a>
                            <ul class="dropdown-menu">
                                <li class="header"><?=sizeof($statusMangas)?> mangas en cours</li>
                                <li>
                                    <!-- inner menu: contains the actual data -->
                                    <ul class="menu">
                                        <?php
                                            foreach($statusMangas as $m){ ?>
                                            <li>
                                                <a href="/Arkham/Mangas/edit/<?=$m['id']?>">
                                                    <h3>
                                                        <?=$m["titre"]?>
                                                        <small class="pull-right"><?=$m["pourcentage"]?>%</small>
                                                    </h3>
                                                    <div class="progress xs">
                                                        <div class="progress-bar progress-bar-green" style="width: <?=$m['pourcentage']?>%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
                                                            <span class="sr-only"><?=$m["pourcentage"]?>% Complete</span>
                                                        </div>
                                                    </div>
                                                </a>
                                            </li>
                                        <?php }?>
                                    </ul>
                                </li>
                                <li class="footer">
                                    <a href="#"></a>
                                </li>
                            </ul>
                        </li>

                        <li class="dropdown tasks-menu">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <i class="fa fa-book"></i>
                                <span class="label label-danger"><?=(sizeof($statusBds))?></span>
                            </a>
                            <ul class="dropdown-menu">
                                
                                <li class="header"><?=sizeof($statusBds)?> bds en cours</li>
                                <li>
                                    <!-- inner menu: contains the actual data -->
                                    <ul class="menu">
                                        <?php
                                            foreach($statusBds as $b){ ?>
                                            <li>
                                                <a href="/Arkham/Bds/edit/<?=$b['id']?>">
                                                    <h3>
                                                        <?=$b["titre"]?>
                                                        <small class="pull-right"><?=$b["pourcentage"]?>%</small>
                                                    </h3>
                                                    <div class="progress xs">
                                                        <div class="progress-bar progress-bar-red" style="width: <?=$b['pourcentage']?>%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
                                                            <span class="sr-only"><?=$b["pourcentage"]?>% Complete</span>
                                                        </div>
                                                    </div>
                                                </a>
                                            </li>
                                        <?php }?>
                                    </ul>
                                </li>
                                <li class="footer">
                                    <a href="#"></a>
                                </li>
                            </ul>
                        </li>

                        <li class="dropdown tasks-menu">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <i class="fa fa-video-camera"></i>
                                <span class="label label-warning"><?=(sizeof($statusSeries))?></span>
                            </a>
                            <ul class="dropdown-menu">
                                <li class="header"><?=sizeof($statusSeries)?> series en cours</li>
                                <li>
                                    <!-- inner menu: contains the actual data -->
                                    <ul class="menu">
                                        <?php
                                            foreach($statusSeries as $b){ ?>
                                            <li>
                                                <a href="/Arkham/Series/edit/<?=$b['id']?>">
                                                    <h3>
                                                        <?=$b["titre"]?>
                                                        <small class="pull-right"><?=$b["pourcentage"]?>%</small>
                                                    </h3>
                                                    <div class="progress xs">
                                                        <div class="progress-bar progress-bar-warning" style="width: <?=$b['pourcentage']?>%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
                                                            <span class="sr-only"><?=$b["pourcentage"]?>% Complete</span>
                                                        </div>
                                                    </div>
                                                </a>
                                            </li>
                                        <?php }?>
                                    </ul>
                                </li>
                                <li class="footer">
                                    <a href="#"></a>
                                </li>
                            </ul>
                        </li>



                            

                       
                        <!-- User Account: style can be found in dropdown.less -->
                        <li class="dropdown user user-menu">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <i class="glyphicon glyphicon-user"></i>
                                <span><?=$username?> <i class="caret"></i></span>
                            </a>
                            <ul class="dropdown-menu">
                                <!-- User image -->
                                <li class="user-header bg-light-blue">
                                    <p>
                                        <?=$username?>
                                        <small>Member since</small>
                                        <?=$usercreated?>
                                    </p>
                                </li>
                                <!-- Menu Body -->
                                <!--<li class="user-body">
                                    <div class="col-xs-4 text-center">
                                        <a href="#">Followers</a>
                                    </div>
                                    <div class="col-xs-4 text-center">
                                        <a href="#">Sales</a>
                                    </div>
                                    <div class="col-xs-4 text-center">
                                        <a href="#">Friends</a>
                                    </div>
                                </li>-->
                                <!-- Menu Footer-->
                                <li class="user-footer">
                                    <!--<div class="pull-left">
                                        <a href="#" class="btn btn-default btn-flat">Profile</a>
                                    </div>-->
                                    <div class="pull-right">
                                        <a href="#" class="btn btn-default btn-flat">Sign out</a>
                                    </div>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </nav>
        </header>
        <div class="wrapper row-offcanvas row-offcanvas-left">
            <!-- Left side column. contains the logo and sidebar -->
            <aside class="left-side sidebar-offcanvas">
                <!-- sidebar: style can be found in sidebar.less -->
                <section class="sidebar">
                    <!-- Sidebar user panel -->
                    <div class="user-panel">
                        <!--<div class="pull-left image">
                            <img src="img/avatar3.png" class="img-circle" alt="User Image" />
                        </div>-->
                        <div class="pull-left info">
                            <p>Hello, <?=$username?></p>

                            <a href="#"><i class="fa fa-circle text-success"></i> Online</a>
                        </div>
                    </div>
                    <!-- search form 
                    <form action="#" method="get" class="sidebar-form">
                        <div class="input-group">
                            <input type="text" name="q" class="form-control" placeholder="Search..."/>
                            <span class="input-group-btn">
                                <button type='submit' name='seach' id='search-btn' class="btn btn-flat"><i class="fa fa-search"></i></button>
                            </span>
                        </div>
                    </form>-->
                    <!-- /.search form -->
                    <!-- sidebar menu: : style can be found in sidebar.less -->
                    <ul class="sidebar-menu">
                        <li class="active">
                            <?php echo $this->Html->link("<i class='fa fa-dashboard'></i> <span>Dashboard</span>", array('controller' => 'homes', 'action' => 'index'), array('escape' => FALSE)); ?>
                        </li>
                        <li class="treeview">
                            <a href="#">
                                <i class="fa fa-book"></i>
                                <span>Livres</span>
                                <i class="fa fa-angle-left pull-right"></i>
                            </a>
                            <ul class="treeview-menu">
                                <li><?php echo $this->Html->link("<i class='fa fa-angle-double-right'></i> Liste des livres", array('controller' => 'livres', 'action' => 'index'), array('escape' => FALSE)); ?></li>
                                <li><?php echo $this->Html->link("<i class='fa fa-angle-double-right'></i> Livre aléatoire", array('controller' => 'livres', 'action' => 'random'), array('escape' => FALSE)); ?></li>
                            </ul>
                        </li>
                        <li class="treeview">
                            <a href="#">
                                <i class="fa fa-video-camera"></i>
                                <span>Films</span>
                                <i class="fa fa-angle-left pull-right"></i>
                            </a>
                            <ul class="treeview-menu">
                                <li><?php echo $this->Html->link("<i class='fa fa-angle-double-right'></i> Liste des films", array('controller' => 'films', 'action' => 'index'), array('escape' => FALSE)); ?></li>
                                <li><?php echo $this->Html->link("<i class='fa fa-angle-double-right'></i> Film aléatoire", array('controller' => 'films', 'action' => 'random'), array('escape' => FALSE)); ?></li>
                            </ul>
                        </li>
                        <li class="treeview">
                            <a href="#">
                                <i class="fa fa-book"></i>
                                <span>Mangas</span>
                                <i class="fa fa-angle-left pull-right"></i>
                            </a>
                            <ul class="treeview-menu">
                                <li><?php echo $this->Html->link("<i class='fa fa-angle-double-right'></i> Liste des mangas", array('controller' => 'mangas', 'action' => 'index'), array('escape' => FALSE)); ?></li>
                                <li><?php echo $this->Html->link("<i class='fa fa-angle-double-right'></i> Manga aléatoire", array('controller' => 'mangas', 'action' => 'random'), array('escape' => FALSE)); ?></li>
                            </ul>
                        </li>
                        <li class="treeview">
                            <a href="#">
                                <i class="fa fa-book"></i>
                                <span>Bandes dessinnées</span>
                                <i class="fa fa-angle-left pull-right"></i>
                            </a>
                            <ul class="treeview-menu">
                                <li><?php echo $this->Html->link("<i class='fa fa-angle-double-right'></i> Liste des BDs", array('controller' => 'bds', 'action' => 'index'), array('escape' => FALSE)); ?></li>
                                <li><?php echo $this->Html->link("<i class='fa fa-angle-double-right'></i> Bande dessinnée aléatoire", array('controller' => 'bds', 'action' => 'random'), array('escape' => FALSE)); ?></li>
                            </ul>
                        </li>
                        <li class="treeview">
                            <a href="#">
                                <i class="fa fa-video-camera"></i>
                                <span>Séries</span>
                                <i class="fa fa-angle-left pull-right"></i>
                            </a>
                            <ul class="treeview-menu">
                                <li><?php echo $this->Html->link("<i class='fa fa-angle-double-right'></i> Liste des séries", array('controller' => 'series', 'action' => 'index'), array('escape' => FALSE)); ?></li>
                                <li><?php echo $this->Html->link("<i class='fa fa-angle-double-right'></i> Série aléatoire", array('controller' => 'series', 'action' => 'random'), array('escape' => FALSE)); ?></li>
                            </ul>
                        </li>
                        
                    </ul>
                </section>
                <!-- /.sidebar -->
            </aside>

            <!-- Right side column. Contains the navbar and content of the page -->
            <aside class="right-side">
                <!-- Content Header (Page header) -->
                <section class="content-header">
                    <h1>
                        Dashboard
                        <small>Control panel</small>
                    </h1>
                    <ol class="breadcrumb">
                        <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
                        <li class="active">Dashboard</li>
                    </ol>
                </section>

                <!-- Main content -->
                <section class="content">
                    <?php echo $this->fetch('content'); ?>
                </section><!-- /.content -->
            </aside><!-- /.right-side -->
        </div><!-- ./wrapper -->

        <!-- add new calendar event modal -->


        <script src="/Arkham/js/jquery-2.1.1.min.js"></script>
        
        <script src="/Arkham/js/bootstrap.min.js" type="text/javascript"></script>
        <!-- Data Tables -->
        <script src="/Arkham/js/plugins/datatables/jquery.dataTables.js" type="text/javascript"></script>
        
        <script src="/Arkham/js/plugins/datatables/dataTables.bootstrap.js" type="text/javascript"></script>
        <!-- AdminLTE App -->
        <script src="/Arkham/js/AdminLTE/app.js" type="text/javascript"></script>

        <?php echo $scripts_for_layout; ?>
        
    </body>
</html>